<template>
  <BaseMainSlot
    :show-tab="true"
  >
    <template v-slot:search-box>
      <SearchForm :formConfig="formConfig" :formData="searchlist" @search="search"></SearchForm>
    </template>
    <template v-slot:btn-box>
      <ActionBar
        :page-no="76"
        :add-active="addActive"
        :del-active="delActive"
        :has-edit="false"
        :has-save="false"
        :has-cancel="false"
        :has-del="false"
        @add="add"
        @del="del"
      />
    </template>
    <template v-slot:table-box>
      <Table @sortChange="changeTableSort" :propList="tableColumn" v-loading="loading"
        :listData="tableData" @handleSelectionChange="handleSelectionChange">
        <template v-slot:operation="{ row }">
          <template v-if="!row.index">
            <el-button
              v-if="judgePermission(76, 'edit')"
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="edit(row)"
            >
              <i class="el-icon-edit-outline"></i> 修改
            </el-button>
            <el-button
              v-if="judgePermission(76, 'delete')"
              class="text-btn-cursor cursor-delete"
              type="text"
              size="small"
              @click="handleDelete(row.returnRecordNo)"
            >
              <i class="el-icon-delete"></i> 删除
            </el-button>
          </template>
        </template>
        <template v-slot:returnQuantity="{ row, item }">
          <template v-if="!row.index">
            {{ row[item.prop] }}
            {{ row.castUnit.symbol }}
          </template>
        </template>
        <template v-slot:materialName="{ row, item }">
          <template v-if="!row.index">
            {{ row.material.materialName }}
          </template>
        </template>
      </Table>
      <Pagination
        :page-size="pageSize"
        :current-page="currentPage"
        :total-size="totalSize"
        @changePageSize="changePageSize"
        @changeCurrentPage="changeCurrentPage"
      />
    </template>
    <template v-slot:dialog>
      <el-dialog
        :title="titleText"
        :visible.sync="dialogFormVisible"
      >
        <el-form
          ref="formData"
          label-position="left"
          :model="formData"
          :rules="rules"
          class="el-form"
        >
          <el-form-item
            label="采购订单编号:"
            :prop="'arriveOrderNo'"
            :rules="{
              required: true,
              message: '采购订单编号不能为空',
              trigger: 'change',
            }"
            class="w50p"
          >
            <el-select
              v-model="formData.arriveOrderNo"
              placeholder="选择采购订单编号"
              filterable
              clearable
              @change="queryOnHandQuantity"
            >
              <el-option
                v-for="item in arrivalList"
                :key="item.arriveOrderNo"
                :label="item.orderNo"
                :value="item.arriveOrderNo"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            label="点击选择:"
            :prop="'materialObj'"
            :rules="{
              required: true,
              message: '不能为空',
              trigger: 'change',
            }"
            class="w50p"
          >
            <el-select
              v-model="formData.materialObj"
              placeholder="点击选择"
              filterable
              clearable
              value-key="materialNo"
              @change="batchObjChange"
            >
              <el-option
                v-for="item in arrivalDetailList"
                :key="item.materialNo"
                :label="item.materialName"
                :value="item"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            label="	退货方式"
            class="w50p"
          >
            <el-select
              v-model="formData.returnMethod"
              placeholder="选择退货方式"
              filterable
              clearable
            >
              <el-option
                :label="'退款'"
                :value="'退款'"
              />
              <el-option
                :label="'换货'"
                :value="'换货'"
              />
              <el-option
                :label="'退货'"
                :value="'退货'"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            label="换算率"
            class="w50p"
            prop="vchangerate"
            :rules="[{required: false, pattern: /^[+]?(\d+)$|^[+]?(\d+\.\d+)$/, message:'值为大于0的数', trigger: ['change','blur']},]"
          >
            <el-input
              v-model="formData.vchangerate"
              disabled
            />
          </el-form-item>
          <el-form-item
            label="退货金额"
            class="w50p"
            prop="returnAmount"
            :rules="[{required: false, pattern: /^[+]?(\d+)$|^[+]?(\d+\.\d+)$/, message:'值为大于0的数', trigger: ['change','blur']},]"
          >
            <el-input
              v-model="formData.returnAmount"
              clearable
            />
          </el-form-item>
          <el-form-item
            label="退货数量"
            class="w50p"
          >
            <el-form-item
              style="width: 70%"
              prop="returnQuantity"
              :rules="[{required: false, pattern: /^[+]?(\d+)$|^[+]?(\d+\.\d+)$/, message:'值为大于等于0的数', trigger: ['change','blur']},]"
            >
              <el-input
                v-model="formData.returnQuantity"
                clearable
              />
            </el-form-item>
            <el-form-item style="width: 30%">
              <el-input
                v-model="formData.castUnitSymbol"
                disabled
              />
            </el-form-item>
          </el-form-item>
          <el-form-item
            label="数量"
            class="w50p"
          >
            <el-form-item style="width: 70%">
              <el-input
                v-model="formData.num"
                disabled
              />
            </el-form-item>
            <el-form-item style="width: 30%">
              <el-input
                v-model="formData.unitSymbol"
                disabled
              />
            </el-form-item>
          </el-form-item>
          <el-form-item
            label="退货人:"
            :prop="'returnPersonName'"
            :rules="{
              required: true,
              message: '退货人不能为空',
              trigger: 'change',
            }"
            class="w50p"
          >
            <el-select
              v-model="formData.returnPersonName"
              placeholder="选择退货人"
              filterable
              clearable
            >
              <el-option
                v-for="item in personList"
                :key="item.value"
                :label="item.person.name"
                :value="item.person.name"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            label="退货原因"
            class="w50p"
          >
            <el-input
              v-model="formData.reason"
              placeholder="请输入退货原因"
              clearable
            />
          </el-form-item>
        </el-form>
        <div
          v-if="nowChanceStau !== ''"
          slot="footer"
          class="dialog-footer"
        >
          <el-button
            class="zh-button-one"
            @click="cancel('formData')"
          >取 消</el-button>
          <el-button
            class="zh-button-two"
            type="primary"
            @click="save('formData')"
          >保 存</el-button>
        </div>
      </el-dialog>
    </template>
  </BaseMainSlot>
</template>

<script src="./index">
</script>
<style scoped lang="scss">
// @import "~@/styles/variables.scss";
</style>
